<template>
  <div class="bank">
    <header>
      <div class="container">
        <div class="title">
          <img src="../../assets/img/cognition.png" alt="">
        </div>
      </div>
    </header>
    <main>
      <div class="container">
        <div class="bankList">
          <div
            v-for="(item,index) in bankList"
            :key="index"
            class="bank">
            <a href="">
              <div class="bankBox">
                <img :src="item.src" alt="">
                <div class="text">
                  <h4>{{item.name}}</h4>
                  <p>{{item.text}}</p>
                </div>
              </div>
            </a>
          </div>
        </div>
      </div>
    </main>
  </div>
</template>

<script>
    export default {
        name: "bank",
        data() {
            return {
                bankList: [
                    {'src': require('../../assets/img/zyxxk1_cover.png'), 'name': '专业信息库', 'text': '教育部颁布的本专科专业大全，任你一一翻阅。'},
                    {'src': require('../../assets/img/zyxxk_cover.png'), 'name': '专业信息库', 'text': '教育部颁布的本专科专业大全，任你一一翻阅。'},
                    {'src': require('../../assets/img/yxxxk_cover.png'), 'name': '专业信息库', 'text': '教育部颁布的本专科专业大全，任你一一翻阅。'},
                ]
            }
        }
    }
</script>

<style scoped lang="scss">
  @import '../../styles/common.scss';
  @import '../../styles/bank/bank.scss';
</style>